<div class="row animate fadeIn">
    <form class="form-horizontal" id="">
    <div class="ibox-title" style="border:none;"><h5 style="color: #00afef"><i>Add</i></h5>
        <div class="ibox-tools">    
             <a class="btn btn-primary btn-sm save-btn-tab" id="submit_release">Save</a>
             <a id="cancel_add" class="btn btn-sm btn-outline btn-info cancel-btn-tab">Cancel</a>
        </div>
     </div>
     <div class="ibox-content">
        
            <div class="form-group">
                <label class="col-lg-3 control-label">Request #</label>
                <div class="col-lg-4">
                     <select class="chosen-select" name="req_num">
                        <option value=""></option> 
                        <?php foreach ($reqs as $key) { ?>
                            <option value="<?php echo $key->inv_request_id; ?>"><?php echo $key->inv_request_num; ?></option>
                        <?php } ?>
                      </select>
                </div>
                <div class="col-lg-1 input-s">
                        <a id = "get_info" class="btn btn-sm btn-outline btn-info">Proceed</a>
                    </div>
             </div>
      </div>
      <div class="ibox-content" id="prevdata">
            <div class="form-inline form-group" >
              <div><label class="col-lg-2 control-label">Request #:</label>
                  <div class="col-lg-2">
                      <label id="txt_reqNum" class="control-label"> -- </label>
                  </div>
              </div>
              <div><label class="col-lg-2 control-label">Request Date:</label>
                  <div class="col-lg-2">
                      <label id="txt_reqDate" class="control-label"> -- </label>
                  </div>
              </div>
              <div><label class="col-lg-2 control-label">Request By:</label>
                  <div class="col-lg-2">
                      <label id="txt_reqBy" class="control-label"> -- </label>
                  </div>
              </div>
            </div>
            <div class="form-inline form-group" >
              <div><label class="col-lg-2 control-label">Approved by:</label>
                  <div class="col-lg-2">
                      <label id="txt_aprvBy" class="control-label"> -- </label>
                  </div>
              </div>
              <div><label class="col-lg-2 control-label">Status:</label>
                  <div class="col-lg-2">
                      <label id="txt_reqStat" class="control-label"> -- </label>
                  </div>
              </div>
            </div>
            
        </div>

    </form>

    <table id="pgTable"class="table table-bordered" style="width:100%;">
                <thead>
                    <tr>
                      <th style="">Seq</th>
                      <th style="">Item</th>
                      <th style="">Quantity</th>
                      <th style="">Released Qty</th>
                      <th style="width:70px;">Action</th>
                    </tr>   
                </thead>
              </form>
                <tbody id="tbl_reqCon" class="animate fadeIn">
                                                
                </tbody>
              </table> 
    <input type="hidden" value="0" id="release_id" />           
    
 </div>
 <script>
    $(document).ready(function(){
    $('#trans_inv_form').data('serialize',$('#trans_inv_form').serialize());
    $(document).off('click','#picks');
    $(document).off('click','.btn.btn-sm.btn-outline.btn-info.btn-xs.complete');
    $('#prevdata').hide();
    $('#pgTable').hide();
    $(".chosen-select").chosen({width:"100%;"}); 
    var request_id;
    $('#get_info').click(function(){
         $.ajax({
          type  : "POST",
          url   :"<?php echo base_url($this->session->userdata('forajax') . '/get_req_content'); ?>",
          dataType  : 'json',
          data : { "req_id" : $('select[name=req_num]').val()  } ,
          success : function(d){
            console.log(d);
           $('#txt_reqNum').html(d.result[0].inv_request_num);
           $('#txt_reqDate').html(d.result[0].inv_request_date);
           $('#txt_reqBy').html(d.result[0].reqfn+' ,'+d.result[0].reqln);
           $('#txt_aprvBy').html(d.result[0].apvfn+', '+d.result[0].apvln);
           $('#txt_reqStat').html(d.result[0].meaning);
            request_id = d.result[0].inv_request_id;
            generate_pick();
            $('#prevdata').show();
            $('#pgTable').show();
          },
                complete: function(data) {
                      $('#get_info').removeAttr('disabled');
                },
                beforeSend: function(){
                      $('#get_info').attr('disabled',true);
                }
        });
    });

    function sumbit_release(){
        $.ajax({
            type:'POST',
            url: "<?php echo base_url($this->session->userdata('forajax') . '/insert_release'); ?>",
            dataType: 'json',
            data : { 'request_id' : request_id },
            success : function(data){

            }
          });  
    }
    
    function generate_pick(){
          $('#tbl_reqCon').empty();
          $.ajax({
            type:'POST',
            url: "<?php echo base_url($this->session->userdata('forajax') . '/get_content'); ?>",
            dataType: 'json',
            data : { 'reqs_id' : request_id },
            success : function(data){
              
              var trHTML='';
              var x = 1;
              $.each(data, function(i, item) {
                if(data[i].inv_item_qty == data[i].inv_released_qty){
                    trHTML += '<tr style="line-height:0;padding:2px;"><input id="reqCon_id" type="hidden" value="'+data[i].req_content_id+'"><td style="text-align:left; padding:5px;">'+data[i].sequence_num+'</td><td style="text-align:left; padding:5px;">'+data[i].description+'</td><td id="request_qty" style="text-align:left; padding:5px;">'+data[i].inv_item_qty+'</td><td id="release_qty" style="text-align:left; padding-left:5px;">'+data[i].inv_released_qty+'</td><td align="center" style="text-align:left; padding:2px;"><span id="iyaid" style="display:none">'+x+'</span></td></tr>';
                      $('#'+x).hide();
                  x++;
                }else{
                     trHTML += '<tr style="line-height:0;padding:2px;"><input id="reqCon_id" type="hidden" value="'+data[i].req_content_id+'"><td style="text-align:left; padding:5px;">'+data[i].sequence_num+'</td><td style="text-align:left; padding:5px;">'+data[i].description+'</td><td id="request_qty" style="text-align:left; padding:5px;">'+data[i].inv_item_qty+'</td><td id="release_qty" style="text-align:left; padding-left:5px;">'+data[i].inv_released_qty+'</td><td align="center" style="text-align:left; padding:2px;"><button id="picks" style="margin-left:5px;margin-bottom:1px;" class="btn btn-sm btn-outline btn-info btn-xs edit" title="Edit"><i class="fa fa-pencil-square-o fa-lg"></i></button><button  style="margin-left:5px;margin-bottom:1px;" class="btn btn-sm btn-outline btn-info btn-xs complete" title="Complete"><i class="fa fa-arrow-circle-o-right fa-lg"></i></button><span id="iyaid" style="display:none">'+x+'</span></td></tr><tr id="'+x+'"></tr>';
                      $('#'+x).hide();
                  x++;
                }  
              });
              $('#tbl_reqCon').html(trHTML);
            }
          });         
    }

    

     $(document).on('click','#picks',function(event){

      event.stopPropagation();
      event.preventDefault();
        var kini = $(this);
          var iddaw = $(this).closest('tr').find('#iyaid').html();
          var recon_id = $(this).closest('tr').find('#reqCon_id').val();
          var reqQty =  $(this).closest('tr').children('#request_qty').html();
          var relQty =  $(this).closest('tr').children('#release_qty').html();
          $('#'+recon_id+'_sub').empty();
          console.log(iddaw);
          $(this).closest('table').find('#'+iddaw).html('');
          $.ajax({
            type:'POST',
            url: "<?php echo base_url($this->session->userdata('forajax') . '/get_picking'); ?>",
            dataType: 'json',
            data : { 'reqcon_id' : recon_id , 'reqQty' : reqQty , 'relQty' : relQty  },
            success : function(data){
              var seq = 10;
              var needed = parseInt(reqQty) - parseInt(relQty);
              console.log('needed:'+needed)
              var alotted = needed;
              var trHTML=''; var left;

              $(kini).closest('table').find('#'+iddaw).html('<td colspan="5" align="center"><table class="table-bordered"  style="width:100%;"><tr><td>Sequence #</td><td>Location</td><td>Item</td><td>On-hand Qty</td><td>Qty</td><td>Left</td></tr><tbody id="'+recon_id+'_sub"></tbody></table></td>');
              $.each(data, function(i, item) {        
                  if( data[i].item_qty - needed >= 0 && needed != 0)   {
                    if(data[i].item_qty != 0){
                      //alert('one'+recon_id);
                      left = data[i].item_qty - needed;
                      trHTML += '<tr style="line-height:0;padding:2px;"><td style="text-align:left; padding:5px;">'+seq+'</td><td style="text-align:left; padding:5px;">'+data[i].loc_desc+'</td><td id="request_qty" style="text-align:left; padding:5px;">'+data[i].i_desc+'</td><td style="text-align:left; padding-left:5px;">'+data[i].item_qty+'</td><td id="" style="text-align:left; padding-left:5px;">'+needed+'</td><td id="" style="text-align:left; padding-left:5px;">'+left+'</td></tr>';
                      seq = seq + 10;
                      needed = needed-needed;
                      console.log("one");
                    }
                  }else if(needed != 0){
                    if(data[i].item_qty != 0){
                      var ee =  ((data[i].item_qty) == 0);
                      //alert('one'+ee+','+data[i].item_qty);
                      left = 0;
                      trHTML += '<tr style="line-height:0;padding:2px;"><td style="text-align:left; padding:5px;">'+seq+'</td><td style="text-align:left; padding:5px;">'+data[i].loc_desc+'</td><td id="request_qty" style="text-align:left; padding:5px;">'+data[i].i_desc+'</td><td style="text-align:left; padding-left:5px;">'+data[i].item_qty+'</td><td id="" style="text-align:left; padding-left:5px;">'+needed+'</td><td id="" style="text-align:left; padding-left:5px;">'+left+'</td></tr>';
                      seq = seq + 10;
                      needed = needed - data[i].item_qty
                      console.log("two"); 
                    }
                  } 
              });

              $('#'+recon_id+'_sub').html(trHTML);   
              //$(this).closest('table').find('#'+iddaw).html(''); 
               $(kini).attr('disabled',true);
            }
          });
     
    });

    $(document).on('click','.btn.btn-sm.btn-outline.btn-info.btn-xs.complete',function(){
      var cur = $(this);
          if($('#release_id').val() == 0 ){
            swal({
                title: "Ops!, Sorry",
                text: "Save release form first before confirming picks."
            });
          }else{
            var kini      = $(this);
            var iddaw     = $(this).closest('tr').find('#iyaid').html();
            var recon_id  = $(this).closest('tr').find('#reqCon_id').val();
            var reqQty    =  $(this).closest('tr').children('#request_qty').html();
            var relQty    =  $(this).closest('tr').children('#release_qty').html();
            console.log(iddaw);
            // $(this).closest('table').find('#'+iddaw).html('');
            $.ajax({
              type:'POST',
              url: "<?php echo base_url($this->session->userdata('forajax') . '/confirm_picking'); ?>",
              dataType: 'json',
              data : { 'reqcon_id' : recon_id , 'reqQty' : reqQty , 'relQty' : relQty , 'rel_id' : $('#release_id').val() , 'req_id' : request_id },
              success : function(data){
                notifymsg("success","   . . . Picking Saved");
                $(cur).attr('disabled',true);
              }
            });
          }
    });


    $('#submit_release').click(function(){
        $.ajax({
            type:'POST',
            url: "<?php echo base_url($this->session->userdata('forajax') . '/insert_release'); ?>",
            dataType: 'json',
            data : { 'request_id' : request_id },
            success : function(data){
              if(data[0].err == 0) {
                notifymsg("danger",data[0].msg);
              }else{
                $('#release_id').val(data[0].id);
                notifymsg("success","   . . . Release Saved");
                $('#submit_release').attr('disabled',true);
              }
              
            }
          });  
    });

    function save_contents(){

    }

    // $(document).on('click','.btn.btn-sm.btn-outline.btn-info.btn-xs.edit',function(event){
    //   alert('animal');
          
    //      //$(this).closest('table').find('#'+iddaw).append('<td colspan="5" align="center"><table style="width:100%;"><tr><td>seq</td><td>item</td><td>qty</td></tr></table></td>');
    // });
  

      function alert_cancel(){
            if($('#trans_inv_form').serialize()!=$('#trans_inv_form').data('serialize')){
                swal({
                    title: "Are you sure?",
                    text: "Your work will not be save",
                    type: "warning",
                    showCancelButton: true,
                    confirmButtonColor: "#DD6B55",
                    confirmButtonText: "Leave",
                    cancelButtonText: "Stay",
                    closeOnConfirm: true,
                    closeOnCancel: true },
                function (isConfirm) {
                    if (isConfirm) {
                        close_add(); active_search();
                        notifymsg("hide","hide");
                        $('#trans_inv_form').remove();
                        $('#pgTable').remove();
                        $('.btn.btn-sm.btn-outline.btn-info.btn-xs.complete').remove();
                        $('#picks').remove();
                    } else {
                        swal("Cancelled");
                    }
                });
                }else{
                close_add(); active_search();
                notifymsg("hide","hide");
            }
        } 
        $('#cancel_add').click(function () {
          if($('#cancel_add').html() == "Complete"){
            close_add(); active_search();
            notifymsg("hide","hide");
          }else{            
            alert_cancel();
          }
        });


      $('#addX').click(function(){
            alert_cancel();      
       });
    });
 </script>  